<template>
  <div class="categroysidebar">
    <van-sidebar v-model="activeKey" @change="onChange">
      <van-sidebar-item v-for="item in datas" :key="item.id" :title="item.text" />
    </van-sidebar>
  </div>
</template>

<script>
export default {
  name: "CategroySideBar",
  props: {
    datas: {
      type: Array
    }
  },
  data() {
    return {
      activeKey: 0
    };
  },
  methods:{
    onChange(){
      // console.log(this.activeKey);
      this.$bus.$emit('toggle',this.activeKey+1)
      
    }
  }
};
</script>

<style lang="less" scoped>
.categroysidebar {
  background-color: #fff;
  width: 80px;
  overflow-y: scroll;
  height: calc(100vh - 40px);
  .van-sidebar {
    .van-sidebar-item {
      padding-right: 0;
    }
  }
}
.categroysidebar::-webkit-scrollbar {
    display: none; /* Chrome Safari */
  }
</style>